<template>
    <div class="app-container">
      <Levelbar></Levelbar>
      <div class="main" v-loading = "loading">
            <div class="form-title">服务开通</div>
            <div class="title" v-if="this.$route.params.state == '4'">
                <el-row type="flex" class="row-bg" justify="center">
                    <el-col :span="1">审核中</el-col>
                </el-row>
            </div>
            <aside>服务信息</aside>
            <el-form ref="form" :model="form" label-width="110px" class="form-pading">
                <el-form-item label="学校">
                    <span class="title-left">{{form.sSchoolName}}</span>
                </el-form-item>
                <el-form-item label="服务名称">
                    <span class="title-left">{{form.sServiceName}}</span>
                </el-form-item>
                <el-form-item label="收费方式">
                    <span class="title-left">
                        <el-radio-group v-model="form.sPayTypeNew">
                            <el-radio label="1" :disabled="disabled">月收</el-radio>
                            <el-radio label="2" :disabled="disabled">年收</el-radio>
                        </el-radio-group>
                    </span>
                </el-form-item>
                <el-form-item label="收费金额">
                    <el-row :gutter="20">
                        <el-col :span="4">
                            <el-form-item label="" label-width="0" prop="sMoney" :rules="rules.sMoney">
                                <el-input-number :disabled="disabled" v-model="form.sMoney" :min="montyList.limitNum * 1" :max="montyList.upNum * 1" style="width:100%" @change="variety($event)"></el-input-number>
                            </el-form-item>
                        </el-col>
                        <el-col :span="1" class="monty-icon">元</el-col>
                        <el-col :span="6">
                            <span class="title-icon">收费范围为{{montyList.limitNum}}~{{montyList.upNum}}元</span>
                        </el-col>
                    </el-row>
                </el-form-item>
                <div v-if="form.sPayTypeNew == '1'">
                  <el-form-item label="月份数" v-for="(monthsVal,index) in form.sNewTimeNum" :key="monthsVal.option">
                    <el-row :gutter="20" >
                        <el-col :span="6">
                          <el-form-item :prop="'sNewTimeNum.' + index + '.name'" :rules="selectsProp" >
                            <el-select :disabled="disabled" clearable v-model="monthsVal.name" placeholder="请选择" style="width:100%" @change="filterSelectMonth(monthsVal,index)">
                                <el-option :disabled="disabled" v-for="val in monthsList" :key="val.option" :label="val.label" :value="val.label">
                                </el-option>
                            </el-select>
                          </el-form-item>
                        </el-col>
                        <el-col :span="3">
                            原价{{monthsVal.price}}元
                        </el-col>
                        <el-col :span="6">
                            <el-form-item :prop="'sNewTimeNum.' + index + '.discount'" :rules="discountProp">
                                <el-input :disabled="disabled" v-model="monthsVal.discount">
                                    <template slot="prepend">优惠价格:</template>
                                </el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="1">
                            元
                        </el-col>
                        <el-col :span="1" class="title-center">
                            <div v-if="state != '4'">
                                <i v-if="form.sNewTimeNum.length > 1 " class="el-icon-delete" @click="removeMonths(monthsVal)"></i>
                            </div>
                        </el-col>
                    </el-row>
                </el-form-item>
                <el-form-item v-if="this.$route.params.state != '4'">
                    <el-row :gutter="20">
                        <el-col>
                            <span class="title-left" v-if="form.sNewTimeNum.length < 12">
                                <i class="el-icon-plus" @click="addMonths"> 继续添加</i>
                            </span>
                        </el-col>
                    </el-row>
                </el-form-item>
                </div>
                <div v-if="form.sPayTypeNew == '2'">
                  <el-form-item label="年份数" v-for="(yearsVal,index) in form.YearsNewTimeNum" :key="yearsVal.option">
                    <el-row :gutter="20">
                        <el-col :span="6">
                          <el-form-item :prop="'YearsNewTimeNum.' + index + '.name'" :rules="selectsProp">
                            <el-select :disabled="disabled" clearable v-model="yearsVal.name" placeholder="请选择" style="width:100%" @change="filterSelectYear(yearsVal,index)">
                                <el-option v-for="val in yearList" :key="val.option" :label="val.label" :value="val.label">
                                </el-option>
                            </el-select>
                          </el-form-item>
                        </el-col>
                        <el-col :span="3">
                            原价{{yearsVal.price}}元
                        </el-col>
                        <el-col :span="6">
                            <el-form-item :prop="'YearsNewTimeNum.' + index + '.discount'" :rules="discountProp">
                                <el-input :disabled="disabled" v-model="yearsVal.discount">
                                    <template slot="prepend">优惠价格:</template>
                                </el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="1">
                            元
                        </el-col>
                        <el-col :span="1" class="title-center">
                            <div v-if="state != '4'">
                                <i v-if="form.YearsNewTimeNum.length > 1 " class="el-icon-delete" @click="removeyear(yearsVal)"></i>
                            </div>
                        </el-col>
                    </el-row>
                </el-form-item>
                <el-form-item v-if="this.$route.params.state != '4'">
                    <el-row :gutter="20">
                        <el-col>
                            <span class="title-left" v-if="form.YearsNewTimeNum.length < 4">
                                <i class="el-icon-plus" @click="addYear"> 继续添加</i>
                            </span>
                        </el-col>
                    </el-row>
                </el-form-item>
                </div>
                <div v-if="vipB == 1">
                  <!-- 判断是否有会员 -->
                  <el-form-item label="是否与会员打包">
                    <span class="title-left">
                        <el-radio-group v-model="form.vipBooleans">
                            <el-radio label="1" :disabled="disabled">是</el-radio>
                            <el-radio label="0" :disabled="disabled">否</el-radio>
                        </el-radio-group>
                    </span>
                  </el-form-item>
                  <div v-if="form.vipBooleans ==1">
                      <div v-if="form.sPayTypeNew == '1'">
                          <el-form-item label="月份" v-for="(vip,index) in form.vipsNewTimeNum" :key="vip.name">
                            <el-row :gutter="20" >
                                <el-col :span="6">
                                    <el-form-item>
                                        <span>{{vip.name}}</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="3">
                                    <!-- 原价{{(form.sMoney * vip.value).toFixed(2)}}元 -->
                                    原价{{vip.originalPrice}}元
                                </el-col>
                                <!-- 目前有两种情况，e直播，保平安  判断当前是那个类型，往参数里面填值-->
                                <el-col :span="6">
                                    <el-form-item :prop="'vipsNewTimeNum.' + index + '.price'" :rules="originalProp">
                                        <el-input :disabled="disabled" v-model="vip.price">
                                            <template slot="prepend">{{form.sServiceName}}价格:</template>
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                            <el-col :span="1">
                            元
                            </el-col>
                            </el-row>
                        </el-form-item>
                      </div>
                      <div v-if="form.sPayTypeNew == '2'">
                          <el-form-item label="月份" v-for="(vip,index) in form.vipsNewTimeNumYear" :key="vip.name">
                            <el-row :gutter="20" >
                                <el-col :span="6">
                                    <el-form-item>
                                        <span>{{vip.name}}</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="3">
                                    <!-- 原价{{(form.sMoney * vip.value).toFixed(2)}}元 -->
                                    原价{{vip.originalPrice}}元
                                </el-col>
                                <!-- 目前有两种情况，e直播，保平安  判断当前是那个类型，往参数里面填值-->
                                <el-col :span="6">
                                    <el-form-item :prop="'vipsNewTimeNum.' + index + '.price'" :rules="originalProp">
                                        <el-input :disabled="disabled" v-model="vip.price">
                                            <template slot="prepend">{{form.sServiceName}}价格:</template>
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                            <el-col :span="1">
                            元
                            </el-col>
                            </el-row>
                        </el-form-item>
                      </div>
                </div>
              </div>
                
                <el-form-item label="收费开始时间">
                    <el-row :gutter="20">
                        <el-col :span="6">
                          <el-form-item prop="sPayStartTime" :rules="dateProp">
                            <el-date-picker :disabled="disabled" :editable="false" :picker-options="pickerOptions" :readonly="this.$route.params.add ? false : true" v-model="form.sPayStartTime" type="datetime" placeholder="输入收费时间" style="width:100%"></el-date-picker>
                          </el-form-item>
                        </el-col>
                    </el-row>
                </el-form-item>
            </el-form>
            <aside>已选设置</aside>
            <el-form label-width="100px" class = "form-pading">
                <el-form-item label="当前学校">
                    <span class="title-left">{{ form.sSchoolName }}</span>
                </el-form-item>
                <el-form-item label="服务名称">
                    <span class="title-left">{{ form.sServiceName }}</span>
                </el-form-item>
                <el-form-item label="收费方式">
                    <span class="title-left">{{ form.sPayTypeNew == '1' ? '月收' : form.sPayTypeNew == '2' ? '年收' : '' }}</span>
                </el-form-item>
                <el-form-item label="收费金额">
                    <span class="title-left"> {{ form.sMoney }}元</span>
                </el-form-item>
                <el-form-item label="收费开始时间">
                    <div class="title-left">
                        <span v-if="this.$route.params.state == '1' && form.sPayStartTime">{{ form.sPayStartTime | parseTime }}开始</span>
                        <span v-else-if="form.sPayStartTime">{{  fifterDate(form.sPayStartTime) }}开始</span>
                        <span v-else>--</span>
                    </div>
                </el-form-item>
            </el-form>
            <footer>
                <!-- 查看是否是查看还是修改开通 -->
                <el-row v-if="this.$route.params.state != '4'" type = "flex" class = "row-bg" justify = "center">
                    <el-col :span="2">
                        <el-button @click="go">返回</el-button>
                    </el-col>
                    <el-col :span="2">
                        <el-button type="primary" @click = " submitForm('form') ">提交申请</el-button>
                    </el-col>
                </el-row>
                <el-row v-else type="flex" class="row-bg" justify="center">
                    <el-col :span="2">
                        <el-button @click="go">返回</el-button>
                    </el-col>
                </el-row>
            </footer>
      </div>
  </div>
</template>
<script>
import Levelbar from '../../layout/Levelbar';
import {
  getPayRecordInfoById,
  saveServiceConfig,
  updateServiceConfig,
  getScopeAmount,
  getProductIsPack,
  getchargeSetting
} from 'api/serviceManage';
export default {
    name: 'newService',
    components: { Levelbar },
    created() {
        this.exhibition();
    },
    data() {
        var validatePass2 = (rule, value, callback) => {
            if (value === '') {
                callback(new Error('请输入价格'));
            } else {
                callback();
            }
        };

        var validatePass3 = (rule, value, callback) => {
            if (value.length > 6) {
                callback(new Error('请输入小于1,000,000的价格'));
            } else {
                callback();
            }
        };
        return {
            rules: {
                sMoney: [
                    { required: true, message: '内容不能为空' },
                    { pattern: /^[0-9]\d*$/, message: '请输入正整数' }
                ]
            },
            state: this.$route.params.state,
            // 收费金额范围
            montyList: {},
            disabled: false,
            // 当前页面数据集合
            form: {
                sSchoolName: '',
                sServiceName: '',
                sPayTypeNew: '1',
                fSchoolId: '',
                fServiceId: '',
                sMoney: '111',
                sPayStartTime: '',
                pId: '',
                sNewTimeNum: [
                    {
                        option: '',
                        name: '',
                        price: '',
                        discount: ''
                    }
                ],
                YearsNewTimeNum: [
                    {
                        option: '',
                        name: '',
                        price: '',
                        discount: ''
                    }
                ],
                vipsNewTimeNum: [
                    
                ],
                vipsNewTimeNumYear: [],
                vipBooleans: '0',
                vipArr: [],
                vipArrYear: []
            },
      // option月份
            monthsList: [
                {
                    label: '1个月',
                    option: 1   
                },
                {
                    label: '2个月',
                    option: 2
                },
                {
                    label: '3个月',
                    option: 3
                },
                {
                    label: '4个月',
                    option: 4
                },
                {
                    label: '5个月',
                    option: 5
                },
                {
                    label: '6个月',
                    option: 6
                },
                {
                    label: '7个月',
                    option: 7
                },
                {
                    label: '8个月',
                    option: 8
                },
                {
                    label: '9个月',
                    option: 9
                },
                {
                    label: '10个月',
                    option: 10
                },
                {
                    label: '11个月',
                    option: 11
                },
                {
                    label: '12个月',
                    option: 12
                }
            ],
      // option年份
            yearList: [
                {
                    label: '半年',
                    option: 0.5
                },
                {
                    label: '一年',
                    option: 1
                },
                {
                    label: '二年',
                    option: 2
                },
                {
                    label: '三年',
                    option: 3
                }
            ],
            vipB: '',
            loading: false,
            selectsProp: { required: true, message: '请选择', trigger: 'change' },
            discountProp: [
                { validator: validatePass2, message: '请输入价格' },
                { pattern: /^\+?[1-9]\d*$/, message: '请输入大于零的整数' },
                { validator: validatePass3, message: '请输入小于1,000,000的价格' }
            ],
            originalProp: [
                { validator: validatePass2, message: '请输入价格' },
                { pattern: /^\+?[1-9]\d*$/, message: '请输入大于零的整数' },
                { validator: validatePass3, message: '请输入小于1,000,000的价格' }
            ],
            dateProp: {
                validator: (rule, value, callback) => {
                    if (!value) {
                        callback(new Error('请选择日期'));
                    } else {
                        callback();
                    }
                },
                trigger: 'change'
            },
      // 限制显示时间
            pickerOptions: {
                disabledDate(time) {
                    return time.getTime() < Date.now() - 8.64e7;
                }
            }
        };
    },
    methods: {
        getAmount() {
            getScopeAmount().then(data => {
                this.montyList = data.data.content;
                this.form.sMoney = this.montyList.limitNum;
                if (this.$route.params.sMoney == 'null') {
                    console.log('没有params.sMoney');
                } else {
                    this.form.sMoney = this.$route.params.sMoney;
                }
            });
        },
        // 查看当前的增值服务是否可以与会员打包购买

        getVip(serviceId) {
            getProductIsPack(serviceId).then(data => {
                // content 商品状态 1可以参与 0不可以参与
                this.vipB = data.data.content;
            }).then(() => {
                // 看会员收费设置
                if (this.vipB == 1) {
                    getchargeSetting().then(data => {
                        // 月份
                        JSON.parse(data.data.content.chargeDetail).forEach(item => {
                            if (this.form.sMoney) {
                                item.price = item.value * this.form.sMoney;
                                item.originalPrice = (this.form.sMoney * item.value).toFixed(2)
                                this.form.vipsNewTimeNum.push(item);
                            }
                        })
                        // 年收
                        JSON.parse(data.data.content.chargeDetail).forEach(item => {
                            if (this.form.sMoney) {
                                item.price = Math.round(this.form.sMoney / 12 * item.value) == 0 ? '1' : Math.round(this.form.sMoney / 12 * item.value)
                                item.originalPrice = Math.round(this.form.sMoney / 12 * item.value) == 0 ? '1.00' : Math.round(this.form.sMoney / 12 * item.value).toFixed(2)
                                this.form.vipsNewTimeNumYear.push(item)
                            }
                        })
                    })
                }
            }).catch(Error => {
                this.$message.error(Error);
            })
        },

    // 返回上一层
        go() {
            this.$router.go(-1);
        },
        exhibition() {
      // 如果当前页面有没有传递值过来，则返回上一页
            if (!this.$route.params.state) {
                this.$router.push({ path: '/serviceContent/serviceConfig' });
            }

      // 获取收费金额范围
            this.getAmount();

            
            if (this.$route.params.state != '4') {
                this.disabled = false;
            } else {
                this.disabled = true;
            }
            this.loading = true;
      // 判断是否是申请开通
            if (this.$route.params.state === '1' ||this.$route.params.add === 'true') {
                this.loading = false;
        // 默认展示月份
                this.form.sPayTypeNew = '1';
                this.form.sSchoolName = this.$route.params.sSchoolName;
                this.form.sServiceName = this.$route.params.sServiceName;
                this.form.fSchoolId = this.$route.params.fSchoolId;
                this.form.fServiceId = this.$route.params.fServiceId;
                // 是否vip
                this.getVip(this.$route.params.fServiceId)
            } else {
                // 修改&&编辑  的时候 需要判断是否是会员
                getProductIsPack(this.$route.params.fServiceId).then(data => {
                // content 商品状态 1可以参与 0不可以参与
                    this.vipB = data.data.content;
                }).then(() => {
                    // 重新调一下会员是否开通
                    if (this.vipB == 1) {
                        getchargeSetting().then(data => {
                            // 会员原始数据
                            // this.form.vipArr = JSON.parse(data.data.content.chargeDetail);
                            JSON.parse(data.data.content.chargeDetail).forEach(item => {
                                if (this.form.sMoney) {
                                    item.price = item.value * this.form.sMoney;
                                    item.originalPrice = (item.value * this.form.sMoney).toFixed(2)
                                    this.form.vipArr.push(item)
                                }
                            })
                            // 年收 
                            JSON.parse(data.data.content.chargeDetail).forEach(item => {
                                if (this.form.sMoney) {
                                    item.originalPrice = Math.round(this.form.sMoney / 12 * item.value) == 0 ? '1.00':Math.round(this.form.sMoney / 12 * item.value).toFixed(2);
                                    item.price = Math.round(this.form.sMoney / 12 * item.value) == 0 ? 1 :Math.round(this.form.sMoney / 12 * item.value);
                                    this.form.vipArrYear.push(item)
                                }
                            })
                            // this.form.vipArr = JSON.parse(data.data.content.chargeDetail);
                            // console.log('---------', JSON.parse(data.data.content.chargeDetail))
                            
                        }).then(() => {
                            getPayRecordInfoById(this.$route.params.obj).then(data => {
                                this.loading = false;
                                if (!data.data.content) return;
                                    // this.form = data.data.content;
                                this.form.pId = data.data.content.pId;
                                this.form.sSchoolName = data.data.content.sSchoolName;
                                this.form.sServiceName = data.data.content.sServiceName;
                                this.form.sPayTypeNew = data.data.content.sPayTypeNew;
                                this.form.fSchoolId = data.data.content.fSchoolId;
                                this.form.fServiceId = data.data.content.fServiceId;
                                this.form.sMoney = data.data.content.sMoney;
                                this.form.sPayStartTime = data.data.content.sPayStartTime;
                                if (data.data.content.sNewTimeNum) {
                                    if (data.data.content.sPayTypeNew == 1) {
                                        this.form.sNewTimeNum = JSON.parse(data.data.content.sNewTimeNum);
                                    } else {
                                        this.form.YearsNewTimeNum = JSON.parse(data.data.content.sNewTimeNum);
                                    }
                                }
                                if (data.data.content.sNewPackTimeNum) {

                                    // 月份
                                    JSON.parse(data.data.content.sNewPackTimeNum).forEach(item => {
                                        this.form.vipArr.map(val => {
                                            if (val.value == item.value) {
                                                val.price = item.price
                                                this.form.vipsNewTimeNum.push(val);
                                            }
                                        })
                                    })

                                    // 年收
                                    JSON.parse(data.data.content.sNewPackTimeNum).forEach(item => {
                                        this.form.vipArrYear.map(val => {
                                            if (val.value == item.value) {
                                                val.price = item.price
                                                // item.originalPrice = Math.round(this.form.sMoney / 12 * item.value) == 0 ? '1.00':Math.round(this.form.sMoney / 12 * item.value).toFixed(2);
                                                // item.price = Math.round(this.form.sMoney / 12 * item.value) == 0 ? 1 :Math.round(this.form.sMoney / 12 * item.value);
                                                this.form.vipsNewTimeNumYear.push(val);
                                            }
                                        })
                                    })
                                    console.log(this.form.vipsNewTimeNumYear, 'this.form.vipsNewTimeNumYear')
                                    // this.form.vipsNewTimeNum = JSON.parse(data.data.content.sNewPackTimeNum);
                                } else {
                                    // 没有选择会员打包，后来又选择了会员打包
                                    this.form.vipsNewTimeNum = this.form.vipArr;
                                    this.form.vipsNewTimeNumYear = this.form.vipArrYear;
                                }

                                    // 是否会员打包
                                this.form.vipBooleans = data.data.content.sIsPack + ''
                            })
                        })
                    } else {
                        // this.loading = false;
                        getPayRecordInfoById(this.$route.params.obj).then(data => {
                            this.loading = false;
                            if (!data.data.content) return;
                                    // this.form = data.data.content;
                            this.form.pId = data.data.content.pId;
                            this.form.sSchoolName = data.data.content.sSchoolName;
                            this.form.sServiceName = data.data.content.sServiceName;
                            this.form.sPayTypeNew = data.data.content.sPayTypeNew;
                            this.form.fSchoolId = data.data.content.fSchoolId;
                            this.form.fServiceId = data.data.content.fServiceId;
                            this.form.sMoney = data.data.content.sMoney;
                            this.form.sPayStartTime = data.data.content.sPayStartTime;
                            if (data.data.content.sNewTimeNum) {
                                if (data.data.content.sPayTypeNew == 1) {
                                    this.form.sNewTimeNum = JSON.parse(data.data.content.sNewTimeNum);
                                } else {
                                    this.form.YearsNewTimeNum = JSON.parse(data.data.content.sNewTimeNum);
                                }
                            }
                        })
                    }
                }).catch(Error => {
                    this.loading = false;
                    this.$message.error(Error);
                });
                
            }
        },
    // 添加月份
        addMonths() {
            this.form.sNewTimeNum.push({
                option: '',
                name: '',
                price: '',
                discount: ''
            });
        },
    // 添加年份
        addYear() {
            this.form.YearsNewTimeNum.push({
                option: '',
                name: '',
                price: '',
                discount: ''
            });
        },

    // 删除月份
        removeMonths(val) {
            this.$confirm('是否删除?', ' ', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: ' '
            })
        .then(() => {
            var index = this.form.sNewTimeNum.indexOf(val);
            if (index !== -1) {
                this.form.sNewTimeNum.splice(index, 1);
            }
        })
        .catch(() => {
            this.$message({
                type: 'info',
                message: '已取消删除'
            });
        });
        },
    // 删除年份
        removeyear(val) {
            this.$confirm('是否删除?', ' ', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: ' '
            })
        .then(() => {
            var index = this.form.YearsNewTimeNum.indexOf(val);
            if (index !== -1) {
                this.form.YearsNewTimeNum.splice(index, 1);
            }
        })
        .catch(() => {
            this.$message({
                type: 'info',
                message: '已取消删除'
            });
        });
        },
        variety(val, index) {

            this.form.sNewTimeNum.forEach((item, i) => {
                if (typeof index !== 'number' || index === i) {
                    let newVal = parseInt(item.name.substring(0, item.name.length - 2), 10);
                    item.price =(newVal * val).toFixed(2) == 'NaN'? '': (newVal * val).toFixed(2);
                    item.discount = newVal * val + '' == 'NaN' ? '' : newVal * val + '';
                    item.option = newVal + '' == 'NaN' ? '' : newVal + '';
                }
            });

            this.form.YearsNewTimeNum.forEach((item, i) => {
                if (typeof index !== 'number' || index === i) {
                    if (item.name === '半年') {
                        item.price = Math.round(0.5 * val).toFixed(2);
                        item.discount = Math.round(0.5 * val) + '';
                        item.option = 0.5 + '';
                    } else {
                        let newVal = item.name.substring(0, item.name.length - 1);
                        let newNum = this.ChineseToNumber(newVal);
                        item.price = (newNum * val).toFixed(2);
                        item.discount = newNum * val + '';
                        item.option = newNum + '';
                    }
                }
            });
                            // 会员月份
            this.form.vipsNewTimeNum.forEach(item => {
                item.originalPrice = (item.value * val).toFixed(2);
            })

                // 会员年份
            this.form.vipsNewTimeNumYear.forEach(item => {
                item.originalPrice = Math.round(item.value / 12 * val).toFixed(2) == 0 ? '1.00' : Math.round(item.value / 12 * val).toFixed(2);
            })

            // 防止产品变卦，先做点击收费金额，会员金额跟着变动
            // this.form.vipsNewTimeNum.forEach((item, i) => {
            //     if (typeof index !== 'number' || index === i) {
            //         console.log(item)
            //         let newVal = parseInt(item.name.substring(0, item.name.length - 2), 10);
            //         item.price =(newVal * val) == 'NaN'? '': (newVal * val);
            //         item.originalPrice = newVal * val + '' == 'NaN' ? '' : newVal * val + '';
            //         item.value = newVal + '' == 'NaN' ? '' : newVal + '';
            //     }
            // })
        },
    // 更改原价和折扣价
        filterSelectMonth(obj, index) {
            let val = obj.name;
      // 判断是否有重复值
            if (!this.filterRepetition(val, this.form.sNewTimeNum, index)) return;
            let newVal = parseInt(val.substring(0, val.length - 2), 10);
            obj.price =
        (newVal * this.form.sMoney).toFixed(2) == 'NaN'
          ? ''
          : (newVal * this.form.sMoney).toFixed(2);
            obj.discount =
        newVal * this.form.sMoney + '' == 'NaN'
          ? ''
          : newVal * this.form.sMoney + '';
            obj.option = newVal + '' == 'NaN' ? '' : newVal + '';
            this.variety(this.form.sMoney, index);
        },
        filterSelectYear(obj, index) {
            let val = obj.name;
      // 判断是否有重复值
            if (!this.filterRepetition(val, this.form.YearsNewTimeNum, index)) return;
            let newVal = val.substring(0, val.length - 1);
            if (newVal == '半') {
                obj.price = Math.round(0.5 * this.form.sMoney);
                obj.discount = Math.round(0.5 * this.form.sMoney) + '';
                obj.option = 0.5 + '';
                this.variety(this.form.sMoney);
            } else {
                let newNum = this.ChineseToNumber(newVal);
                obj.price = (newNum * this.form.sMoney).toFixed(2);
                obj.discount = newNum * this.form.sMoney + '';
                obj.option = newNum + '';
                this.variety(this.form.sMoney, index);
            }
        },
    // 大写数组转换小写
        ChineseToNumber(str) {
            var chnNumChar = {
                零: 0,
                一: 1,
                二: 2,
                三: 3,
                四: 4,
                五: 5,
                六: 6,
                七: 7,
                八: 8,
                九: 9
            };
            var rtn = 0;
            var section = 0;
            var number = 0;
            var secUnit = false;
            var strArray = str.split('');

            for (var i = 0; i < strArray.length; i++) {
                var num = chnNumChar[strArray[i]];
                if (typeof num !== 'undefined') {
                    number = num;
                    if (i === strArray.length - 1) {
                        section += number;
                    }
                } else {
                    var unit = chnNameValue[strArray[i]].value;
                    secUnit = chnNameValue[strArray[i]].secUnit;
                    if (secUnit) {
                        section = (section + number) * unit;
                        rtn += section;
                        section = 0;
                    } else {
                        section += number * unit;
                    }
                    number = 0;
                }
            }
            return rtn + section;
        },
    // 过滤重复值
        filterRepetition(val, arr, index) {
            if (!val) return;
            let num = 0;
            let filterState = true;
            arr.forEach((item, newindex) => {
                if (val === item.name) {
                    num++;
                }
                if (num >= 2) {
                    this.$message('不能选择重复的值');
          // console.log(arr[index])
                    arr[index].discount = '';
                    arr[index].option = '';
                    arr[index].price = '';
                    arr[index].name = '';
          // item.discount = '';
          // item.option = '';
          // item.price = '';
          // item.name = '';
                    val = '';
                    filterState = false;
                }
            });
            return filterState;
        },
        submitForm(form) {
            this.$refs[form].validate(valid => {
                if (valid) {
                    switch (this.$route.params.state) {
                        case '1':
                            this.openService();
                            break;

                        case '2':
                            this.againOpenService();
                            break;
                        case '3':
                            this.modOpenService();
                            break;
                        default:
                            break;
                    }
                } else {
                    console.log('error submit!!');
                    return false;
                }
            });
        },
    // 返回年月日时分秒
        fifterDate(date) {
            if (typeof date === 'string') {
                return date;
            } else {
                let month = this.addZero(date.getMonth() + 1 + '');
                let day = this.addZero(date.getDate() + '');
                let hour = this.addZero(date.getHours() + '');
                let minutes = this.addZero(date.getMinutes() + '');
                let seconds = this.addZero(date.getSeconds() + '');
                return `${date.getFullYear()}-${month}-${day} ${hour}:${minutes}:${seconds}`;
            }
        },
    // 加0
        addZero(str) {
            if (typeof str === 'string') {
                return str.length > 1 ? str : '0' + str;
            }
        },
    // 判断用户选择月份还是年份
        monthOrYear() {
            let month = JSON.stringify(this.form.sNewTimeNum);
            let year = JSON.stringify(this.form.YearsNewTimeNum);
            let typeArr = [];
            if (this.form.sPayTypeNew == '1') {
                typeArr = month;
            } else {
                typeArr = year;
            }
            return typeArr;
        },

    // 会员 判断选择月份还是年份
        vipMonthOrYear() {
            let vipObj = this.form.vipBooleans == 1 ? JSON.stringify(this.form.vipsNewTimeNum) : JSON.stringify(this.form.vipsNewTimeNum);
            let vipObjYear = this.form.vipBooleans == 1 ? JSON.stringify(this.form.vipsNewTimeNumYear) : JSON.stringify(this.form.vipsNewTimeNumYear);
            let typeArr = [];
            if (this.form.sPayTypeNew == '1') {
                typeArr = vipObj;
            } else {
                typeArr = vipObjYear;
            }
            return typeArr;
        },

    // 申请开通
        openService() {
            this.$confirm('确认申请开通?', ' ', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: ' '
            })
        .then(() => {
            this.loading = true;
            saveServiceConfig(
            this.form.fSchoolId,
            this.form.sSchoolName,
            this.form.fServiceId,
            this.form.sServiceName,
            this.form.sPayTypeNew,
            this.form.sMoney,
            this.fifterDate(this.form.sPayStartTime),
            this.monthOrYear(),
            this.form.fOrgUserId,
            this.form.vipBooleans,
            this.vipMonthOrYear()
          )
            .then(data => {
              // 整页刷新
                this.$store.dispatch('UpdateCache');
                this.loading = false;
                this.$message({
                    type: 'success',
                    message: '申请成功！'
                });
                this.$router.push({ path: '/serviceContent/serviceConfig' });
            })
            .catch(Error => {
                this.loading = false;
                this.$message.error(Error);
            });
        })
        .catch(() => {
            this.$message({
                type: 'info',
                message: '已取消申请'
            });
        });
        },

    // 重新开通
        againOpenService() {
            this.$confirm('是否申请重新开通', ' ', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: ' '
            })
        .then(() => {
            this.loading = true;
            updateServiceConfig(
            this.form.fSchoolId,
            this.form.pId,
            this.form.sPayTypeNew,
            this.form.sMoney,
            this.fifterDate(this.form.sPayStartTime),
            this.monthOrYear(),
            this.form.fServiceId,
            '1',
            this.form.vipBooleans,
            this.vipMonthOrYear()
          )
            .then(data => {
                this.loading = false;
                this.$message({
                    type: 'success',
                    message: '申请成功！'
                });
                this.$router.push({ path: '/serviceContent/serviceConfig' });
              // 局部刷新
                this.$store.dispatch('UpdateCache', true);
            })
            .catch(Error => {
                this.$message.error(Error);
                this.loading = false;
            });
        })
        .catch(() => {
            this.$message({
                type: 'info',
                message: '已取消申请'
            });
        });
        },
    // 修改开通
        modOpenService() {
            this.$confirm('是否修改开通？', ' ', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: ''
            })
        .then(() => {
            this.loading = true;
            updateServiceConfig(
            this.form.fSchoolId,
            this.form.pId,
            this.form.sPayTypeNew,
            this.form.sMoney,
            this.fifterDate(this.form.sPayStartTime),
            this.monthOrYear(),
            this.form.fServiceId,
            '2',
            this.form.vipBooleans,
            this.vipMonthOrYear()
          )
            .then(data => {
                this.loading = false;
                this.$router.push({ path: '/serviceContent/serviceConfig' });
              // 局部刷新
                this.$store.dispatch('UpdateCache', true);
            })
            .catch(Error => {
                this.loading = false;
                this.$message.error(Error);
            });
            this.$message({
                type: 'success',
                message: '修改成功!'
            });
        })
        .catch(() => {
            this.$message({
                type: 'info',
                message: '已取消修改'
            });
        });
        }
    }
};
</script>
<style lang="scss" scoped>
.title-left {
  margin-left: 10px;
}
.monty-icon {
  padding-left: 0 !important;
}
.el-icon-plus {
  color: #ff5e2c;
}
.title-icon {
  color: #999;
}
.title-center {
  text-align: center;
}
.title {
  padding-top: 30px;
  font-size: 20px;
}
footer {
  padding: 20px 0 40px;
}
i {
  cursor: pointer;
}
.main {
  padding: 0 50px;
  background: #fff;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
  .form-title {
    padding-top: 8px;
    text-align: center;
    font-size: 18px;
    color: #333;
    line-height: 72px;
    font-weight: bold;
    font-family: Microsoft YaHei;
    border-bottom: 1px solid #ddd;
  }
}
aside {
  position: relative;
  padding: 36px 0 0 20px;
  font-size: 14px;
  color: #333;
  margin-bottom: 40px;
  &::before {
    height: 14px;
    width: 4px;
    background: #ff5e2c;
    content: "";
    position: absolute;
    left: 0;
    bottom: 4px;
  }
}
input {
  -webkit-appearance: none;
  -moz-appearance: none;
  background-color: #fff;
  background-image: none;
  border-radius: 2px;
  border: 1px solid rgb(217, 200, 191);
  box-sizing: border-box;
  color: rgb(61, 41, 31);
  display: inline-block;
  font-size: inherit;
  height: 36px;
  line-height: 1;
  outline: none;
  padding: 3px 10px;
  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  width: 100%;

  &:focus {
    outline: none;
    border-color: #ff5e2c;
  }
}
</style>
